<!--
 * @Author: albert shyttsyj@126.com
 * @Date: 2024-06-06 21:54:38
 * @LastEditors: albert shyttsyj@126.com
 * @LastEditTime: 2024-06-10 11:46:24
 * @FilePath: /sales-assistant-admin/src/views/demo/index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%A
-->
<template>
   <div class="demo--wrap">
    <el-card class="box-card"  shadow="hover">
      <div slot="header" class="clearfix">
        <span>列表组件</span>
      </div>
      <listDemo />
    </el-card>
    <el-card class="box-card"  shadow="hover">
      <div slot="header" class="clearfix">
        <span>图标</span>
      </div>
      iconfont: <icon name="yemian" />
      <br/>
      iconsvg: <svg-icon class-name="yemian" icon-class="yemian" />
    </el-card>
    <el-card class="box-card"  shadow="hover">
      <div slot="header" class="clearfix">
        <span>选择组件</span>

      </div>
      选择客户组件:
      <select-customer v-model="customerId" />
      弹窗选择基础组件:
      <el-alert style="float: right; padding: 3px 0" :closable="false" title="后面再增加产品等组件或者自己可以用<table-select/>封装  可参考选择客户组件" type="success"/>
      <table-select/>
    </el-card>
    <el-card class="box-card"  shadow="hover">
      <div slot="header" class="clearfix">
        <span>Bpm审批组件</span>
      </div>
      <bpmDemo />
    </el-card>
  </div>
</template>

<script>
import listDemo from './list-demo.vue'
import bpmDemo from '@/bpm/demo'
export default {
  name: 'Demo-Index',
  components: {
    listDemo,
    bpmDemo
  },
  data() {
    return {
      customerId:''
    }
  },
  created() {},
  methods: {}
}
</script>

<style lang="scss" scoped>

 .demo--wrap {
    font-size: 14px;
    margin: 10px;
  }

  .item {
    margin-bottom: 18px;
  }
.clearfix{
 font-weight: 900;
 font-size: 16px;
 color: #3974f4;
}
  .clearfix:before,
  .clearfix:after {
    display: table;
    content: "";

  }
  .clearfix:after {
    clear: both
  }

  .box-card {
    width: 45%;
    margin: 5px;
  }
</style>
